<template>
  <el-drawer v-model="drawer" class="drawer-layout" size="400px" title="发起退款" direction="rtl" :before-close="close"
    :close-on-click-modal="false">
    <div class="info-container">
      <div class="info-container_body">
        <div class="form-section">
          <el-form ref="refFrom" label-position="top" :model="form.model">
            <AgelFormGrid :items="form.items" :span="24" :gutter="16">
              <template #slot-text>
                <el-input v-if="form.model.refundReason == '0'" v-model="form.model.remark" :rows="2"
                  type="textarea" placeholder="请填写具体退款原因" />
              </template>
            </AgelFormGrid>
          </el-form>
        </div>
      </div>
      <div class="info-container_footer">
        <el-button @click="close">取消</el-button>
        <el-button type="primary" @click="handleSubmit">确定</el-button>
      </div>
    </div>
  </el-drawer>
</template>

<script setup name="RecordAdd" lang="ts">
import { setRefund } from '@/api/operation/order/index';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { refund_reason } = toRefs<any>(proxy?.useDict('refund_reason'));
const defaultModel = () => ({
  orderId: '',
  totalOrderActualPayment: '',
  refundAmount: '',
  currentRefundAmount: '',
  refundReason: '',
  remark: '',
});
const drawer = ref(false);
const form = reactive({
  model: defaultModel(),
  items: [
    { prop: 'orderId', label: '订单单号', attrs: { disabled: true } },
    { prop: 'totalOrderActualPayment1', label: '订单付款金额（元）', attrs: { disabled: true } },
    { prop: 'refundAmount1', label: '已退款金额（元）', attrs: { disabled: true } },
    { prop: 'currentRefundAmount', label: '本次退款金额（元）',required: true, attrs: { type: 'number' } },
    {
      prop: 'refundReason',
      label: '退款原因',
      slot: 'agel-select',
      
      attrs: {
        options: refund_reason
      }
    },
    {
      prop: 'remark',
      slot: 'slot-text',
      label: '',
      attrs: { type: 'text' }
    },
  ]
});
const loading = ref(false);
const refFrom = ref<ElFormInstance>();
const emits = defineEmits(['close', 'success']);

const openRefundSet = (row) => {
  row.totalOrderActualPayment1 = row.totalOrderActualPayment / 100;
  row.refundAmount1 = row.refundAmount / 100;

  Object.assign(form.model, row);
  console.log(row, form.model);
  drawer.value = true;
};
/** 取消 */
const close = () => {
  drawer.value = false;
  form.model = defaultModel();
  emits('close');
};
/** 确认 */
const handleSubmit = async () => {
  if (!refFrom.value) return;
  refFrom.value.validate((valid, fields) => {
    if (valid) {
      requestAdd();
    } else {
      console.log('error submit!', fields);
    }
  });
};
const requestAdd = async () => {
  loading.value = true;
  if (form.model.refundReason == "0") {
    if (form.model.remark.trim() == "") {
      ElMessage.error("请输入退款原因！");
      return;
    }
    //form.model.refundReason = form.model.refundReason1;
  }
  let row = JSON.parse(JSON.stringify(form.model));
  row.currentRefundAmount *= 100;
  console.log(form.model);

  let res = await setRefund(row);
  loading.value = false;
  if (res.code == 200) {
    proxy?.$modal.msgSuccess('操作成功！');
    emits('success');
    close();
  } else {
    proxy?.$modal.msgError(res.msg || '操作失败！');
  }
};
defineExpose({ openRefundSet });
</script>
